<!-- 打包任务下发 弹窗 -->
<template>
  <div>
    <el-form ref="form" :rules="rules" :model="formContent" label-width="100px">
      <el-form-item label="待打包数量" prop="parcel" v-if="type === '1'">
        <el-input v-model="formContent.parcel" style="width:85%" :disabled="true" />
      </el-form-item>
      <el-form-item label="下发数量" prop="issueQuantity" v-if="type === '1'">
        <el-input v-model="formContent.issueQuantity" style="width:85%"/>
      </el-form-item>
      <el-form-item label="订单数量" prop="packageQuantity" v-if="type === '0'">
        <el-input v-model="formContent.packageQuantity" style="width:85%" :disabled="true" />
      </el-form-item>
      <el-form-item label="作业人" prop="staffName">
        <el-select v-model="formContent.staffName" filterable placeholder="请选择" style="width:85%"  clearable @change="staffChange($event)">
          <el-option
            v-for="item in staffList"
            :key="item.code"
            :label="item.name + '（' + item.code + '）'"
            :value="item"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="作业类型" prop="jobType" v-if="type === '0'">
        <el-select v-model="formContent.jobType" placeholder="请选择" style="width:85%"  clearable>
          <el-option
            v-for="item in jobList"
            :key="item.code"
            :label="item.name"
            :value="item.code">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="计费方式" prop="billingMethod">
        <el-select v-model="formContent.billingMethod" placeholder="请选择" style="width:85%" clearable :disabled="disabledMethod">
          <el-option
            v-for="item in billingList"
            :key="item.code"
            :label="item.name"
            :value="item.code">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="计费单价" prop="billingPrice">
        <el-input v-model="formContent.billingPrice" placeholder="计费单价" style="width:85%" :disabled="disabledPrice" />
      </el-form-item>
      <el-form-item class="dialog-footer" v-if="type === '1'">
        <el-button type="primary" :loading="isDisable" plain @click="submitData">确 定</el-button>
      </el-form-item>
      <el-form-item class="dialog-footer" v-if="type === '0'">
        <el-button type="primary" :loading="isDisable" plain @click="packTaskIssue">确 定</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import { chooseData, getPackBillingInfo, issuePrepackaged, packTaskIssue, billingPrice } from '@/api/packManagement/prePackaged'
export default {
  name: 'PackagingTasks',
  props: {
    packageRef: {
      type: Object,
      required: true
    },
    deliveryList: {
      type: Array
    }
  },
  data() {
    return {
      formContent: {
        parcel: '',
        issueQuantity: '',
        staffName: '',
        billingMethod: '',
        billingPrice: '',
        packageQuantity:'',
        jobType: '',
      },
      type: '',
      isDisable: false,
      staffList: [],
      billingList: [
        {code:'days' , name:'按天'},
        {code:'hours' , name:'按工时'},
        {code:'pieces' , name:'计件'}
      ],
      jobList: [
        {code:'pack', name:'打包'},
        {code:'paste', name:'贴单'},
        {code:'pack_paste', name:'打包+贴单'}
      ],
      rules: {
        parcel: [
          { required: true, message: '待打包数量', trigger: 'blur' }
        ],
        issueQuantity: [
          { required: true, message: '请输入下发数量', trigger: 'blur' },
          { pattern: /^[0-9]*[1-9][0-9]*$/, message: '下发数量必须大于0' }
        ],
        packageQuantity: [
          { required: true, message: '请输入订单数量', trigger: 'blur' }
        ],
        jobType: [
          { required: true, message: '请选择作业类型', trigger: 'change' },
        ],
        staffName: [
          { required: true, message: '请选择作业人', trigger: 'change' },
        ],
        billingMethod: [
          { required: true, message: '请选择计费方式', trigger: 'blur' },
        ],
        billingPrice: [
          { required: true, message: '请输入计费单价', trigger: 'blur' },
          { pattern: /^[+]{0,1}(\d+)$|^[+]{0,1}(\d+\.\d{0,6})$/, message: '小数点后请保留六位小数' },
        ]
      },
      disabledMethod: false,
      disabledPrice: false
    }
  },
  created() {
    this.getInfo()
    this.$set(this.formContent,'code',this.packageRef.code)
    this.$set(this.formContent,'parcel',this.packageRef.parcel)
    this.$set(this.formContent,'packageQuantity',this.packageRef.packageQuantity)
    this.$set(this.formContent,'pickingQuantity',this.packageRef.pickingQuantity)
    this.formContent.warehouseCode = this.packageRef.warehouseCode
    this.type = this.packageRef.type
    this.formContent.jobType = this.jobList[2].code
    this.formContent.billingMethod = this.billingList[2].code
  },
  methods:{
    getInfo() {
      chooseData().then(response => {
        this.staffList = response.data
      })
      billingPrice().then(res => {
        this.formContent.billingPrice = res.data
      })
    },
    // 作业人获取
    staffChange(e) {
      this.formContent.staffName = e.name
      this.formContent.partyCode = e.code
      getPackBillingInfo({partyCode: e.code}).then(res => {
        if(res.data) {
          this.formContent.billingMethod =  res.data.billingMethod
          this.formContent.billingPrice =  res.data.billingPrice
          this.disabledMethod = true
          this.disabledPrice = true
          // this.$forceUpdate()
          // billingMethod: "pieces"
          if(res.data.billingMethod === 'pieces') {
            this.disabledPrice = false
          }
        } else {
          this.formContent.jobType = this.jobList[2].code
          this.formContent.billingMethod = this.billingList[2].code
          this.disabledMethod = false
          this.disabledPrice = false
        }
      })
    },
    // 确定
    submitData() {
      this.$refs['form'].validate((valid) => {
        if (valid) {
          if(this.formContent.issueQuantity > this.formContent.parcel) {
            this.$message.error('下发数量不能大于待打包数量')
            return
          }
          this.isDisable = true
          issuePrepackaged(this.formContent).then(res => {
            this.$message({ message: res.msg, type: 'success' })
            this.$emit('packagingTasksComplete')
          }).finally(() => {
            this.isDisable = false
          })
        } else {
          return false
        }
      })
    },
    // 待打包订单 确认
    packTaskIssue(){
      this.$refs['form'].validate((valid) => {
        if (valid) {
          if(this.formContent.issueQuantity > this.formContent.parcel) {
            this.$message.error('下发数量不能大于待打包数量')
            return
          }
          this.isDisable = true
          this.formContent.deliveryList = this.deliveryList
          packTaskIssue(this.formContent).then(res => {
            this.$message({ message: res.msg, type: 'success' })
            this.$emit('packagingTasksComplete')
          }).finally(() => {
            this.isDisable = false
          })
        } else {
          return false
        }
      })
    }
  }
}
</script>
<style scoped>
.dialog-footer{
  margin: 15px 10px 15px 0;
  float: right;
}
.el-select-dropdown__item.selected {
    color: #606266;
    font-weight: 400;
  }
</style>
